﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <style type="text/css">
        #particularity #myPara {
            color:red;
        }
        #myPara {
            color: blue;
        }

        #inheritance {
            color: yellow;
        }
    </style>
</head>
<body>
    <div id="particularity">
        <h2>
            规则的特殊性
        </h2>
        <h3>特殊性列表:特殊性分成4个等级 a , b, c, d</h3>
        <ol>
            <li>行类样式a=1</li>
            <li>b为id选择器的个数</li>
            <li>c为class，属性，伪类选择器的个数</li>
            <li>d为类型选择器的个数</li>
        </ol>
        <p id="myPara">是红色还是蓝色呢？2个id选择器的特殊性大于一个id选择器的特殊性</p>
    </div>


    <div id="inheritance">
        <h2>自己可以从父级元素继承样式</h2>
        <p>这个段落从父级元素继承了黄色字体</p>
    </div>
</body>
</html>
